<template>
  <UniversalContainer name="默认Card" :paramaters="type">
    <Card :Func="fn" :List="ListVal.item" :title="TitleName"></Card>
  </UniversalContainer>
</template>

<script setup lang="ts">
import { ref } from "vue";
import Card from "../../baseComponent/Card.vue";
import UniversalContainer from "../UniversalContainer.vue";
import { reactive } from "vue";

const TitleName = ref("田家元日");
const ListVal = reactive({
  item: [
    "昨夜斗回北，今朝岁起东。",
    "我年已强仕，无禄尚忧农。",
    "桑野就耕父，荷锄随牧童。",
    "田家占气候，共说此年丰。",
  ],
});

const type = ref(
  `
  import Card from "../../baseComponent/Card.vue";
  import { reactive } from "vue";
  import { ref } from "vue";

  <Card :Func="fn" :List="ListVal.item" :title="TitleName"></Card>
  
  const TitleName = ref("田家元日");
  const ListVal = reactive({
  item: [
    "昨夜斗回北，今朝岁起东。",
    "我年已强仕，无禄尚忧农。",
    "桑野就耕父，荷锄随牧童。",
    "田家占气候，共说此年丰。",
    ],
  });
  const fn = () => {
    alert("this is a function!");
  };
  `
);
const fn = () => {
  alert("this is a function!");
};
</script>

<style scoped lang="scss"></style>
